// import { forwardRef, memo } from 'react'
import { Flex, Select } from 'antd'
import style from './style.module.less'

interface ParamsType {
  setSearchValue: (a: any) => void
  searchValue?: string
}

const TableSearchBox = ({ setSearchValue }: ParamsType) => {
  const handleChange = (value: any) => {
    const nextSearchValue = value
    setSearchValue(nextSearchValue)
  }
  return (
    <Flex gap={4} wrap="nowrap" align="flex-start" vertical>
      <div className={style.searchWrapBox}>
        <div className={style.searchWrap}>
          <Select
            className="w-full"
            placeholder="请选择"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.reSet}>重置搜索</div>
      </div>
      <Flex gap={14} wrap="nowrap" align="flex-start">
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择注册地区"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择国标行业分类"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择火石行业分类"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择注册资本"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择企业类型"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择成立年限"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
        <div className={style.selectWrap}>
          <Select
            className="w-full"
            placeholder="请选择公告时间"
            options={[
              {
                label: '增量同步',
                value: 'incremental'
              },
              {
                label: '全量同步',
                value: 'whole'
              }
            ]}
            onChange={handleChange}
          />
        </div>
      </Flex>
    </Flex>
  )
}

export default TableSearchBox
